import React, { Component } from 'react'
import {
  BrowserRouter as Router,
  Route,
  Link,
  useLocation,
  Redirect,
  Switch
} from 'react-router-dom'

import HomePage from './Home'
import Position from './Position'
import Login from './Login'


const User = () => {
  return <h1>user page</h1>
}


export default class index extends Component {

  constructor() {
    super();
    this.state = {
      islogin: false
    }
    this.routers = [
      {
        path: "/home", component: HomePage, auth: false
      },
      {
        path: "/position", component: Position, auth: true
      }, {
        path: "/user", component: User, auth: true
      }
    ]
  }

  handleLogin = () => {
    this.setState({
      islogin: true
    })
  }


  render() {
    return (
      <Router>
        <Link to="/home">首页</Link> &nbsp;
        <Link to="/position">职位管理</Link> &nbsp;
        <Link to="/user">用户管理</Link>

        <hr />
        {/* <Route path="/home" component={HomePage}>
        </Route> */}

        {/* <Route path="/position" render={() => {
          return  this.state.islogin? <Position></Position> : <Login login={this.handleLogin}></Login>
        }} >

        </Route> */}

        {
          this.routers.map((item) => {
              return <Route path={item.path} render={() => {
                return  item.auth?(this.state.islogin ? <item.component></item.component> : <Login login={this.handleLogin}></Login>):<item.component></item.component>
              }}>
            </Route>
          })
        }

      </Router>
    )
  }
}
